<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<link
	href="${pageContext.request.contextPath}/javascript/bootstrap/css/bootstrap.min.css"
	rel="stylesheet">

<!-- bootstrap table组件以及中文包的引用*@ -->
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script
	src="${pageContext.request.contextPath}/javascript/myjavascript/jQuery-1.12.4.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script
	src="${pageContext.request.contextPath}/javascript/bootstrap/js/bootstrap.min.js"></script>
<script
	src="${pageContext.request.contextPath}/javascript/table/bootstrap-table.js"></script>
<link
	href="${pageContext.request.contextPath}/javascript/table/bootstrap-table.css"
	rel="stylesheet" />
<script
	src="${pageContext.request.contextPath}/javascript/table/locale/bootstrap-table-zh-CN.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/javascript/myjavascript/myjs.js">
	
</script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/javascript/My97DatePicker/WdatePicker.js">
	
</script>
<body>
	<!-- <h3>产品显示</h3> -->
	<table class="table" width="90%" id="mytable" style="font-size: 18px">
	</table>
	<!-- 产品修改模态框-->
	<!-- <button type="button" class="btn btn-primary btn-lg"
		data-toggle="modal" data-target="#myModal">Launch demo modal
	</button> -->

	<!-- Modal -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
				</div>
			</div>
		</div>
</body>

<script type="text/javascript">
	$(function() {
		var t = new TableInit();
		t.Init();
	})
	var TableInit = function() {
		var oTableInit = new Object();
		oTableInit.Init = function() {
			//alert("----加载表格代码----");
			//以bootstrap的形式加载表格
			$('#mytable').bootstrapTable({
				url : 'showAllFiles.action', //请求后台的URL（*）
				method : 'get', //请求方式（*）
				striped : true, //是否显示行间隔色
				pagination : true, //是否显示分页（*）
				sidePagination : "server", //分页方式：client客户端分页，server服务端分页（*）
				uniqueId : "ID", //每一行的唯一标识，一般为主键列
				pageNumber : 1, //初始化加载第一页，默认第一页
				pageSize : 5, //每页的记录行数（*）
				pageList : [ 5, 10, 25, 50, 100 ], //可供选择的每页的行数（*）
				queryParams : oTableInit.queryParams,//传递参数（*）

				columns : [ {
					checkbox : true
				}, {
					field : 'id',
					title : '文件ID'
				}, {
					field : 'file_name',
					title : '文件名称'
				}, {
					field : 'file_desc',
					title : '文件介绍'
				}, {
					field : 'file_auto_name',
					title : '文件自动名称'
				}, {
					field : 'id',
					title : '操作',
					formatter : actionFormatter
				} ]

			});
		}
		//--------加载表格的参数----------
		oTableInit.queryParams = function(params) {
			var temp = {
				limit : params.limit,
				offset : params.offset,
			}
			return temp;
		}
		return oTableInit;
	}

	function actionFormatter(value, row, index) {

		return "<a class='btn btn-danger' href='#' onclick='del("
				+ value
				+ ")'>删除文件</a>"
				+ "&nbsp;&nbsp;"
				+ "<a class='btn btn-success' data-toggle='modal' data-target='#myModal' href='#' onclick='downLoad("
				+ value + ")'>下载文件</a>" + "&nbsp;&nbsp;";
		;

	}
	function del(id) {
		 $.ajax({
			type : "post",
			url : "delete.action",
			data : {
				"id" : id
			},
			success : function(msg) {
				alert('删除成功');
				$('#mytable').bootstrapTable('refresh');
			}
		}) 
	}
	function downLoad(id) {
		/* $.ajax({
			type : "post",
			url : "downLoad.action",
			data : {
				"id" : id
			},
			success : function(msg) {
				alert(msg);
				$('#mytable').bootstrapTable('refresh');
			}
		}) */
		var f = confirm("确定要下载该文件吗?");
		if (f) {
		location.href = "downLoad.action?id=" + id;
		//$('#mytable').bootstrapTable('refresh');
		}
	}
</script>

</html>